import { inject, observer } from 'mobx-react'
import React, { FC, useEffect, useState } from 'react'
import { Tag } from 'antd'
import {
  DingtalkOutlined
} from '@ant-design/icons';
import './advise.scss'
import { Image, List,Avatar, Empty } from 'antd-mobile'
import Myhead from '../../components/myhead'
import { useNavigate, useParams } from 'react-router-dom'
import moment from 'moment'
import { baseURL } from '../../api/request'
import { vipList } from '../../utils';
import { FillinOutline ,DeleteOutline} from 'antd-mobile-icons'
import { ajax } from '../../api';

const Myadvise:FC<any>=({advise,uinfo})=>{
  const {userInfo,changeInfoAsync}=uinfo
 const {adviseList,getAdviseList,changeadvise,myadvise,getmyadvise,filteradviseList,filtergetAdviseList}=advise
  const navigate = useNavigate()
  const [obj,setObj] = useState<any>(null)
  const params = useParams()
   //获取用户信息，
   useEffect(()=>{
    ajax.getuser({
        _id:params.aid 
    })
    .then(res=>{
        if(res.code==200){
            setObj(res.result)
        }
    })
    filtergetAdviseList(params.aid)
},[])
  

  //点击查看，携带——id进入详情页
  const gotoDetailed_advise=(item:any)=>{
    navigate('/detailed/adviseDetailed/'+item._id)
    }
  return (
    <div className='paddingtop adviseStyle' style={{marginBottom:"0.44rem"}}>
      <Myhead title="意见箱" back='true'></Myhead>
      {
          filteradviseList&&filteradviseList.length!=0?<List>
            {filteradviseList.map((advise:any) => (
              
              <List.Item
              onClick={()=>gotoDetailed_advise(advise)}
                key={advise._id}
                prefix={
                  advise.info.avatar?<Avatar src={advise.info.avatar.replace(/public/,baseURL)} style={{width:"0.4rem",height:"0.4rem"}} />:<Avatar src={require('../../assets/images/xiaoxin_2.jpg')} style={{width:"0.4rem",height:"0.4rem"}}></Avatar>
                }
                description={<div 
                style={{fontSize:13,color:"#666"}}
                dangerouslySetInnerHTML={{__html:advise.content }}>
                {/* 转义成html */}
                </div>}
              >
                <div>
                  <span style={{fontSize:14}}>{advise.info.username}</span>
                  <span style={{marginLeft:20}}>
                    
                       <Tag icon={<DingtalkOutlined />} color={vipList.find(v=>v.value==advise.info.role)?.color}>
                       {vipList.find(v=>v.value==advise.info.role)?.label}

                       </Tag>
                  </span>
                </div>
                <div>
                  <span style={{fontSize:12,color:"#999"}}>{moment(advise.time).format("YYYY-MM-DD HH:mm")}</span>
                  <span style={{fontSize:12,color:"#999",marginLeft:5}}>留下建议：</span>
                  </div>
                
              </List.Item>
            ))}
          </List>:<div>
                    <Empty
                    style={{ padding: '0.64rem 0' }}
                    imageStyle={{ width: 128 }}
                    description='暂无数据'
                    />
          </div>
        }
        <div style={{height:"0.44rem"}}></div>
    </div>
  )
}

export default inject('advise','uinfo')(observer(Myadvise))